<template>
    <div class="mb-4">
      <el-row>
        <el-col :span="6">
          <research6 @output="onput" />
        </el-col>
        <el-col :span="2">
          <el-button type="primary" plain @click="onClick">搜索</el-button>
        </el-col>
        <el-col :span="3">
          <el-button plain @click="reSet">重置</el-button>
        </el-col>
      </el-row>
    </div>
    <br />
    <el-col> <el-button  type="danger":icon="Delete" @click="deleteUser">删      除</el-button></el-col>
    <br />
    <el-table :data="tableData" border style="width: 100%" @selection-change="selectDeleteUser">
      <el-table-column type="selection" width="55" />
      <el-table-column prop="imagelink" label="帖子链接"  />
      <el-table-column prop="title" label="帖子标题" width="180" />
      <el-table-column prop="time" label="帖子时间" width="180" />
      <el-table-column prop="content" label="帖子内容" width="250" />
      <el-table-column prop="createDate" label="创建日期" width="200" />
    </el-table>
  </template>
  
  <script lang="ts">
  import research6 from './research6.vue';
  export default {
    components: {
      research6
    }
  }
  </script>
  
  <script lang="ts" setup>
  import { ref, onMounted } from 'vue';
  import axios from 'axios';
  
  const input = ref(0);
  const tableData = ref([]);
  const selectedRows = ref([]);
  
  const onput = (e) => {
    console.log(e);
    input.value = e;
  }
  
  const onClick = () => {
    try {
      axios.get('http://localhost:9001/Post/searchPost', {
        params: { info: input.value }
      }).then(response => {
        console.log(input);
        tableData.value = response.data;
      });
    } catch (error) {
      console.error('连接失败：', error.message);
    }
  }
  
  const reSet = () => {
    //input.value = "";
    try {
      axios.post('http://localhost:9001/Post/getAllPost', {
        params: { info: input.value }
      }).then(response => {
        console.log(input);
        tableData.value = response.data;
      });
    } catch (error) {
      console.error('连接失败：', error.message);
    }
  }
  
  import {
    Check,
    Delete,
    Edit,
    Message,
    Search,
    Star,
  } from '@element-plus/icons-vue'
  
  onMounted(async () => {
    try {
      const response = await axios.post('http://localhost:9001/Post/getAllPost');
      tableData.value = response.data;
    } catch (error) {
      console.error('连接失败：', error.message);
    }
  });
  
  const selectDeleteUser=(select) => {
    console.log(select);
    selectedRows.value=select;
  }
  function deleteUser(){
    console.log(selectedRows.value);
    axios.post('http://localhost:9001/Post/deletePost',selectedRows.value).then(response => {
      alert("删除成功!")
    })
  }
  </script>
  